<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<head>
	<th:block th:include="include :: header('修改推送配置信息')" />
	<th:block th:include="include :: summernote-css" />
	<th:block th:include="include :: select2-css" />
</head>

<body class="white-bg">
	<div class="wrapper wrapper-content animated fadeInRight ibox-content">
		<form class="form-horizontal m" id="form-detooa-edit" th:object="${deToOaConfig}">
			<input name="configId" th:field="*{configId}" type="hidden">
			<input name="resourceId" th:field="*{resourceId}"id="treeId"  type="hidden">
			<h4 class="form-header h4">推送配置信息</h4>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">仪表板名称：</label>
				<div class="col-sm-10">
					<div class="input-group">
						<input name="resourceName" th:field="*{resourceName}"  onclick="selectResourceTree()" id="treeName" type="text" required placeholder="请选择仪表板" class="form-control">
						<span class="input-group-addon"><i class="fa fa-search"></i></span>
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">接收人工号：</label>
				<div class="col-sm-10">
					<input name="loginIdList" th:field="*{loginIdList}" class="form-control" type="text" required placeholder="请输入接收人工号，多个接收人以已英文逗号隔开，如：000000,111111">
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">推送标题：</label>
				<div class="col-sm-10">
					<input name="title" th:field="*{title}" class="form-control" type="text" placeholder="请输入推送标题" required>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">推送模版内容：</label>
				<div class="col-sm-10">
					<textarea name="context" class="form-control" placeholder="请输入推送模版内容" required style="height: 150px;">[[*{context}]]</textarea>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">启用推送：</label>
				<div class="col-sm-10">
					<div class="radio-box" th:each="dict : ${@dict.getType('sys_yes_no')}">
						<input type="radio" th:id="${'status_' + dict.dictCode}" name="status" th:value="${dict.dictValue}" th:checked="${dict.default}" required>
						<label th:for="${'status_' + dict.dictCode}" th:text="${dict.dictLabel}"></label>
					</div>
				</div>
			</div>
			<h4 class="form-header h4">已选仪表板信息</h4>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">是否已分享：</label>
				<div class="col-sm-10">
					<p id="valid" class="form-control-static"></p>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">链接：</label>
				<div class="col-sm-10">
					<p id="shortUrl" class="form-control-static"></p>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">密码：</label>
				<div class="col-sm-10">
					<p id="pwd" class="form-control-static"></p>
				</div>
			</div>
			<div class="form-group">
				<label class="col-sm-2 control-label is-required">过期时间：</label>
				<div class="col-sm-10">
					<p id="overTime" class="form-control-static"></p>
				</div>
			</div>
		</form>
	</div>
	<th:block th:include="include :: footer" />
	<th:block th:include="include :: summernote-js" />
	<th:block th:include="include :: select2-js" />
	<script th:inline="javascript">
		var prefix = ctx + "detooa/detooa"
		$("#form-detooa-edit").validate({
			focusCleanup: true
		});
		var valid = false;
		function submitHandler() {
			if (!valid) {
				//正上方
				layer.msg('请选择一个已分享的仪表板', {
					offset: 't',
					anim: 6,
					icon: 2,
				  	time: 1000 //一秒关闭
				});
				return;
			}

			if ($.validate.form()) {
				$.operate.save(prefix + "/edit", $('#form-detooa-edit').serialize());
			}
		}

		/* 选择仪表板树 */
		function selectResourceTree() {
			var treeId = $("#treeId").val();
			var treeName = $("#treeName").val();
			var resourceId = $.common.isEmpty(treeId) ? "" : $("#treeId").val();
			var resourceName = $.common.isEmpty(treeName) ? "" : $("#treeName").val();
			var url = ctx + "detooa/de/selectResourceTree?resourceId=" + resourceId + "&resourceName=" + resourceName;
			var options = {
				title: '选择仪表板',
				width: "380",
				url: url,
				callBack: doSubmit
			};
			$.modal.openOptions(options);
		}

		function doSubmit(index, layero) {
			var body = $.modal.getChildFrame(index);
			var nodeType = body.find('#nodeType').val();
			if ("panel" == nodeType) {
				$("#treeId").val(body.find('#treeId').val());
				$("#treeName").val(body.find('#treeName').val());
				$("#nodeType").val(body.find('#nodeType').val());
				$.modal.close(index);
				currentGenerate($("#treeId").val());
			} else {
				//正上方
				layer.msg('请选择一个根节点', {
					offset: 't',
					anim: 6
				});
			}
		}

		function currentGenerate(resourceId) {
			var url = ctx + "detooa/de/currentGenerate/" + resourceId;
			$.get(url, function (result) {
				console.log(result);
				if (result.code == 0) {
					console.log(result.data.valid);
					valid = result.data.valid;
					$("#valid").html(result.data.valid ? "是" : "否");
					$("#enablePwd").html(result.data.enablePwd ? "是" : "否");
					$("#pwd").html(result.data.pwd);
					$("#overTime").html(result.data.overTimeFmt);
					if(result.data.valid){
						shortUrl(resourceId);
					}else{
						$("#shortUrl").html("");
					}
				}
			});
		}
		
		function shortUrl(resourceId) {
			var url = ctx + "detooa/de/shortUrl/" + resourceId;
			$.get(url, function (result) {
				console.log(result);
				if (result.code == 0) {
					$("#shortUrl").html([[${T(com.detooa.detooa.config.DataEaseConfig).deBaseUrl}]] + result.data.data);	
				}
			});
		}
		
		currentGenerate([[${deToOaConfig.resourceId}]]);
	</script>
</body>

</html>